	<template>
  <div>
    <Return style="background: #eeeeee" txt="群成员(2)"></Return>
    <div class="input">
      <van-icon v-if="search == ''" class="input_icon" name="search" />
      <input type="text" class="inputAl" v-model="search" placeholder="搜索" />
    </div>
    <div class="list">
      <div class="listOne" v-for="item of list">
        <img class="list_img" src="../../assets/images/logo.png" alt="" />
        <span>测试人员</span>
      </div>
      <div class="listOne" @click="addTap">
        <div class="add">+</div>
      </div>
       <div class="listOne" @click="editTap">
        <div class="add">-</div>
      </div>
    </div>
  </div>
</template>
<script>
import Return from "../../components/return";
export default {
  components: {
    Return,
  },
  data() {
    return {
      search: "",
      list: [1, 2, 3],
    };
  },
  methods: {
    addTap() {
      this.$router.push("/qunliao");
    },
    editTap(){
        
    }
  },
};
</script>
<style scoped>
.input {
  height: 50px;
  width: 100%;
  text-align: center;
  line-height: 50px;

  position: relative;
  background: #eeeeee;
}
.input_icon {
  position: absolute;
  left: 43%;
  top: 15px;
  font-size: 18px;
}
.inputAl::-webkit-input-placeholder {
  padding-left: 5%;
}
.inputAl {
  height: 35px;
  width: 96%;
  border-radius: 50px;
  border: none;
  text-align: center;
}
.list {
  width: 90%;
  margin-left: 5%;
  display: flex;
  flex-wrap: wrap;
}
.listOne {
  width: 20%;
  display: flex;
  align-items: center;
  flex-direction: column;
  font-size: 12px;
  color: #989898;
  margin-top: 10px;
}
.list_img {
  width: 50px;
  height: 50px;
  border-radius: 5px;
}
.add {
  width: 50px;
  height: 50px;
  border-radius: 5px;
  border: 1.5px dashed #ccc;
  font-size: 30px;
  text-align: center;
  line-height: 50px;
}
</style>